<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="author" content="https://blog.csdn.net/q475254344" />
    <title>Title</title>
    <link rel="stylesheet" type="text/css" th:href="@{/layui/css/layui.css}">
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <script th:src="@{/js/jquery-3.1.1.min.js}"></script>
    <script th:src="@{/layui/layui.js}" charset="utf-8"></script>
</head>
<body>
<div class="layui-container">
<table class="layui-table" lay-filter="demo" id="test1">
    <thead>
    <tr>
        <th lay-data="{field:'username', width:300,sort:true}">试卷</th>
        <th lay-data="{field:'id', width:300, sort:true}">学生姓名</th>
        <th lay-data="{field:'sign',sort:true}">分数</th>
    </tr>
    </thead>
    <tbody>
    <tr th:each="exam:${list}">
        <td th:text="${exam.getExam_name()}"></td>
        <td th:text="${exam.getStu_name()}"></td>
        <td th:text="${exam.getScore()}"></td>
    </tr>
    </tbody>
</table>
</div>
<script>
    layui.use('table', function(){
        var table = layui.table;

        //第一个实例
        //转换静态表格
        table.init('demo', {
            // height: 500 //设置高度
            limit: 11 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
            //支持所有基础参数
            ,page: true //开启分页

        });
    });
</script>
</body>
</html>